<template>
  <div class="comWidth">
    <ul class="list">
      <li v-for="list in lists">
        <span class="title">{{list.title}}</span>
        <span class="time">{{list.created_at | time}}</span>
        <span class="edit"><router-link to="issue/edit">编辑</router-link></span>
      </li>
    </ul>
  </div>

</template>
<script>
  import http from 'axios'
  import timeStamp  from 'time-stamp'

  export default {
    name: "Issue",
    data() {
      return {
          lists:[]
      }
    },
    mounted(){
        http.get(" https://api.github.com/repos/yanping90/js/issues").then((r)=>{
            console.log(r);
            this.lists = r.data;
        })
          .catch();
    },
    filters:{
        time:function () {
          return timeStamp('YYYY-MM-DD HH:mm');
        }
    }
  }
</script>
<style scoped>
  .comWidth{
    width:800px;
  }
  .list{
    list-style-type: none;
    text-align: left;
    font-size:14px;
  }
  .list li{
    height: 40px;
    line-height: 40px;
    border-bottom: 1px dashed #ddd;
  }
  .list li span.title{
    width:600px;
    display: inline-block;
  }
  .list li span.time{
    color:#888;
  }
  .list li span.edit a{
    color:#f80;
  }
</style>
